### Список стандартных путей браузера

Для просмотра необходимо ввести указанное значение в строку url браузера и перейти по ней.

###### Просмотр информации о браузере:
> `chrome://version/`

###### Экспериментальные опции браузера:
> `chrome://flags/`

###### Графические характеристики:
> `chrome://gpu/`

###### Просмотр исходного кода страницы (PC и Android):
> `view-source:https://google.com/`

###### Просмотр содержимого файлов установленного расширения в браузере:
> `chrome-extension://${idExtension}/${fileName}`
>>	idExtension - идентификатор расширения (можно посмотреть в разделе "Получение значения идентификатора расширения - В интерфейсе браузера")
>>		PS: в настройках расширение должно быть включено, в противном случае будет показана ошибка: ERR_BLOCKED_BY_CLIENT
>>	fileName - имя файла расширения
>>		PS: имя файла можно посмотреть в папке с расширениями в профиле браузера

###### Диспетчер закладок:
> `chrome://bookmarks/`

###### История:
> `chrome://history/`

###### Настройки:
> `chrome://settings/`

###### Управление расширениями:
> `chrome://extensions/`

###### Capture Network Log:
> `chrome://net-export/`

###### Страница управления инструментами разработчика:
> `chrome://inspect/`

###### Приложения браузера (выведено из эксплуатации в 2020 г.)
>`chrome://apps/`
###### Просмотр содержимого расширения с каталогами в файловой системе:
> `file:///${path}/Default/Extensions/${idExtension}/`
>>	idExtension - идентификатор расширения (Получение значения идентификатора расширения - В интерфейсе браузера)
>>	path - путь в файловой системе к папке профиля браузера (можно посмотреть в разделе "Просмотр информации о браузере")
>>
>>		Команда для Windows: file:///C:/Users/Raven/AppData/Local/Google/Chrome/User%20Data/Default/Extensions/${idExtension}/
>>		Команда для MacOS: /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome/User/Default/Extensions/${idExtension}/

### Открытие палитры команд
Горячие клавиши:
- `Control + Shift + P (Windows / Linux)`
- `Command + Shift + P (Mac)`

Используется для выполнения различных команд и открытия файлов, выполняется при открытых инструментах разработчика.
Для просмотра возможных действий стереть символ `>` и ввести `?`.
Подробнее по [ссылке](https://developer.chrome.com/docs/devtools/command-menu).
TODO Добавить описание с открытием файлов через палитру команд

TODO Добавить описание с заменой скриптов приложения на локальные файлы для изменения их поведения

### Запуск браузера с дополнительными параметрами
Для запуска с дополнительными параметрами необходимо в параметры запуска добавить требуемы параметр.
```
Команда для Windows:
> "C:\Program Files\Google\Chrome\Application\chrome.exe" --${additionalParam}

Команда для MacOS:
> /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --${additionalParam}

	additionalParam - дополнительный параметр
```
### Запуск  браузера с установкой исходного кода расширения через командную строку
Необходимо запустить браузер с дополнительным параметром, в котором указать путь к устанавливаемому расширению:
```
Общее описание команды:
> ${pathToExecutionFile} --load-extension=${pathToSouceCodeExtension}
	pathToExecutionFile - путь к исполняемому файлу браузера
	pathToSouceCodeExtension - путь к папке '/extension' с исходным кодом расширения

Команда для Windows:
> "C:\Program Files\Google\Chrome\Application\chrome.exe" --load-extension=C:\Users\UserName\Documents\extensions_examples\message_sender\extension

Команда для MacOS:
> /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --load-extension=C:\Users\UserName\Documents\extensions_examples\message_sender\extension
```
### Путь к исполняемому файлу браузера
Содержится на странице просмотра информации о браузере, подробнее в разделе: **Просмотр информации о браузере**.
### Путь к профилю браузера
Содержится на странице просмотра информации о браузере, подробнее в разделе: **Просмотр информации о браузере**.
## Расширения браузера (Chrome Extensions)
### Способы открытия страницы опций
###### Открытие страницы опций на отдельной вкладке
```
// Указать в manifest.json:
"options_page": "${pathToOptionsHtml}"

	pathToOptionsHtml - путь к html-странице опций
```
###### Открытие страницы опций в окне на текущей или отдельной вкладке
```
// Указать в manifest.json:
"options_ui": {
	"page": "${pathToOptionsHtml}",
	"open_in_tab": ${isOpenNewTab}
}

	pathToOptionsHtml - путь к html-странице опций
	isOpenNewTab - true/false значение открытия страницы опций на отдельной вкладке
```
### Получение значения идентификатора расширения
###### В расширении
```
В файле content_script.js выполнить:
let id = chrome.runtime.id
// TODO Уточнить в каких модулях расширения можно еще получить идентификатор
```
###### В интерфейсе браузера
1. открыть страницу с расширениями, согласно разделу **Управление расширениями**;
2. открыть страницу *Сведения* требуемого расширения;
3. в строке url браузера будет показан идентификатор расширения;
## Chrome DevTools (Инструменты разработчика)
#### Открытие окна инструментов разработчика в отдельном окне
1. открыть инструменты разработчика в обычном оконном виде;
2. в правом верхнем углу нажать на "троеточие";
3. в открывшемся меню выбрать кнопку отображения в отдельном окне;

Подробнее по [ссылке](https://stackoverflow.com/questions/12291138/how-do-you-inspect-the-web-inspector-in-chrome/12291163#12291163).
### Chrome DevTools Protocol (CDP)
Базовый протокол, описывающий действия браузера.
#### Запуск браузера в режиме отладки
Браузер запускается и поднимается локальный сервер на указанном порту, позволяя взаимодействовать по протоколу *CDP*.
Для запуска браузера в режиме отладки необходимо воспользоваться разделом **Запуск браузера с дополнительными параметрами** с указанием дополнительного параметра:
```
--remote-debugging-port=${port}

	port - порт запуска, по умолчанию 9222

Команда для Windows:
> "C:\Program Files\Google\Chrome\Application\chrome.exe" --remote-debugging-port=9222

Команда для MacOS:
> /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222
```
#### Удаленное взаимодействие по протоколу CDP
1. запустить браузер в режиме отладки из раздела **Запуск браузера в режиме отладки**;
2. отправить запрос на локальный сервер:  `${typeRequest} localhost:9222${path}`, где:

| ${typeRequest} | ${path} | Описание |
| -------- | -------- | -------- |
| GET | `/json/version` | Получить версию протокола |
| GET | `/json/protocol` | Получить текущий протокол |
| GET | `/json/json/list` | Получить список открытых вкладок |
| PUT | `/json/new?{url}` | Открыть новую вкладку с указанным `url`(Encode вид) |
| GET | `/json/activate/{targetId}` | Переключиться на вкладку и идентификатором `targetId` |
| GET | `/json/close/{targetId}` | Закрыть вкладку и идентификатором `targetId` |
| GET | `/devtools/page/{targetId}` | TODO |
| GET | `/devtools/inspector.html` | Открыть копию панели инструментов разрабочика в отдельном окне |

Примеры:
```
curl -X PUT "http://localhost:9222/json/json/list"
curl -X PUT "http://localhost:9222/json/new?https%3A%2F%2Fya.ru%2F" (параметр указывается в Encode виде - https://www.url-encode-decode.com/)
```
### Просмотр команд API DevTools в интерфейсе
Для просмотра необходимо:
1. открыть инструменты разработчика (DevTools);
2. выбрать "шестеренку" в верхней правой части окна инструментов разработчика;
3. в левом горизонтальном меню выбрать категорию *"Experiments"*;
4. в списке экспериментальных функций выбрать *"Protocol Monitor"*;
5. закрыть инструменты разработчика и открыть снова;
6. в верхнем правом углу нажать на "троеточие", в открывшемся меню *"More Tools" -> "Protocol Monitor"*;
#### Выполнение команд
##### В интерфейсе
1. открыть вкладку *"Protocol Monitor"* согласно описанию из раздела **Просмотр команд API DevTools в интерфейсе**;
2. выполнить команду:
	1. путем ввода в нижнем поле ввода каманды;
	2. открыть редактор команд в левом нижнем углу, сформировать и выполнить команду;
##### В окне инструментов разработчика для оана инструментов разработчика
1. открыть инструменты разработчика нажатием горячих клавиш:
    - `Control + Shift + I (Windows / Linux)` 
    - `Command + Shift + I (Mac)`
2. перевести окно инструментов разработчика в отдельное окно (описано в разделе **Открытие окна инструментов разработчика в отдельном окне**)
3. Находясь в фокусе открытого окна инструментов разработчика повторно нвжать сочетание клавиш из п.1
### Сбор логов
#### Сохранение HAR-архива запросов и ответов
Данным способом сохраняются только запросы и ответы открытой вкладки.
Для сохранения необходимо:
1. открыть инструменты разработчика;
2. перейти на вкладку Network (Сеть);
3. при необходимости очистить содержимое запросов и ответов;
4. в интерфейсе браузера выполнить требуемые действия;
5. на вкладке Network нажать правой кнопкой мыши в на любоем запросе и выбрать в контекстном меню "Save all as Har with content" ("Сохранить как HAR с содержимым");
#### Сохранение всех логов браузера
Данным способом сохраняются все данные относительно соединения, использования кэша браузера, событий и данных о подключении. Данным способом не собираются запросы и ответы.
##### Сохранение на запущенном браузере
Для получения логов необходимо:
1. открыть новую вкладку со страницей настроек сохранения логов согласно раздела **Capture Network Log**;
2. в окне настроек выбрать требуемый уровень логгирования и нажать кнопку *Start Logging to Disk*;
3. в окне выбора файла для сохранения указать расположение и имя сохраняемого файла;
4. открыть новую вкладку и выполнить требуемые действия (вкладка *Capture Network Log* в этот момент должна быть открыта);
5. для завершения вернуться на вкладку *Capture Network Log* и нажать кнопку *Stop Logging*;
##### Запуск логгирования при старте браузера
Необходимо добавить параметр запуска согласно раздела **Запуск браузера с дополнительными параметрами**:
>	--log-net-log=${path}
>>	path - путь и имя файла в формате json для сохранения

Так же можно указать дополнительный параметры сбора логов:
>	--net-log-max-size-mb=${size}
>>	size - максимальный размер в мегабайтих

>	--net-log-capture-mode=${mode}
>>	mode - режим сбора данных для логов, возможные значения: default, includeSensitive, everything (TODO данные значения требуют уточнения, т.к. в разных источниках указываются разные значения)

##### Просмотр логов
Файл собранных логов можно посмотреть следующими способами:
	1. в окне с результатами записи логов нажать кнопку **Show File** и открыть сохраненный файл в текстовом редакторе;
	2. открыть в просмотрщике [просмотрщиком](https://netlog-viewer.appspot.com/#import) логов браузера;

[Исходный код](https://chromium.googlesource.com/catapult/+/HEAD/netlog_viewer/) приложения netlog_viewer.

### Ссылки
TODO Разобрать ссылки
[Стартовая страница навигации по документации создания расширений браузера](https://developer.chrome.com/docs/extensions?hl=en)
[Список примеров расширений браузера Chrome с поиском по фильтрам](https://developer.chrome.com/docs/extensions/samples?hl=en)
[Chrome DevTools Protocol](https://chromedevtools.github.io/devtools-protocol/)
[getting-started-with-cdp/README.md at master · aslushnikov/getting-started-with-cdp · GitHub](https://github.com/aslushnikov/getting-started-with-cdp/blob/master/README.md)
[GitHub - ChromeDevTools/awesome-chrome-devtools: Awesome tooling and resources in the Chrome DevTools & DevTools Protocol ecosystem](https://github.com/ChromeDevTools/awesome-chrome-devtools#chrome-devtools-protocol)
[GitHub - ChromeDevTools/devtools-protocol: Chrome DevTools Protocol](https://github.com/ChromeDevTools/devtools-protocol)
[GitHub - ChromeDevTools/awesome-chrome-devtools: Awesome tooling and resources in the Chrome DevTools & DevTools Protocol ecosystem](https://github.com/ChromeDevTools/awesome-chrome-devtools)
[GitHub - ChromeDevTools/awesome-chrome-devtools: Awesome tooling and resources in the Chrome DevTools & DevTools Protocol ecosystem](https://github.com/ChromeDevTools/awesome-chrome-devtools)
[Chrome DevTools Protocol](https://chromedevtools.github.io/devtools-protocol/)
[GitHub - cyrus-and/chrome-remote-interface: Chrome Debugging Protocol interface for Node.js](https://github.com/cyrus-and/chrome-remote-interface)
[Run Chromium with command-line switches](https://www.chromium.org/developers/how-tos/run-chromium-with-flags/)
[How to capture a NetLog dump (chromium.org)](https://www.chromium.org/for-testers/providing-network-details/)
[KAK - Chrome List of Chromium Command Line Switches (kornev-online.net)](https://kak.kornev-online.net/FILES/KAK%20-%20Chrome%20List%20of%20Chromium%20Command%20Line%20Switches.pdf)
https://chromium.googlesource.com/chromium/blink/+/refs/heads/main/Source/devtools/protocol.json
https://learn.microsoft.com/ru-ru/microsoft-edge/devtools-protocol-chromium/
https://github.com/kklisura/chrome-devtools-java-client